import * as React from 'react'
import {View, SafeAreaView, StyleSheet, Text,} from 'react-native'
import SettingListCommon from '../../../../common/component/settingListCommon'
import Back from '../../../../common/component/back'


let usernameArr = [
  {icon: require('./img/password.png'),title: '登录密码',state: '未设置',stateBtn: false, stateActive: false, url: 'Home'},
  {icon: require('./img/password.png'),title: '微信账号',state: '已绑定',stateBtn: false, stateActive: false, url: 'Home'},
  {icon: require('./img/password.png'),title: 'QQ账号',state: '已绑定',stateBtn: false, stateActive: false, url: 'Home'},
  {icon: require('./img/password.png'),title: '微博账号',state: '未绑定',stateBtn: false, stateActive: false, url: 'Home'}
]

let infomArr = [
  {icon: require('./img/password.png'), title: '关注我的',state: null,stateBtn: true, stateActive: true, url: 'Home'},
  {icon: require('./img/password.png'), title: '喜欢我的',state: null,stateBtn: true, stateActive: true, url: 'Home'},
  {icon: require('./img/password.png'), title: '私信我的',state: null,stateBtn: true, stateActive: true, url: 'Home'},
  {icon: require('./img/password.png'), title: '系统我的',state: null,stateBtn: true, stateActive: true, url: 'Home'}
]




class SettingListPage extends React.Component{

  constructor(props){
    super(props)
    this.state = {pageTitle: this.props.route.params.pageTitle}
  }

 


  render(){
    let {navigation, route} = this.props;
    let {params} = route
 
    let myListArr = []
  
    if(params.pageTitle == "账号设置"){
      // listArr = [...a];
      myListArr = [...usernameArr]
    } 

    switch(params.pageTitle){
      case "账号设置":
        myListArr = [...usernameArr]
        break;
      case "通知设置": 
        myListArr = [...infomArr]
        break;
      default:
        myListArr = [];
    }
    
    return(
      <SafeAreaView style={styles.container}>
         <Back navigation={navigation} witheIcon={false}></Back>

        <View style={{ flex: 1 ,margin: 15}}>
         
          <Text style={styles.title}>{params.pageTitle}</Text>
          <View style={{marginTop: 20}}>
            {myListArr.map((item,index)=>{
              return (
              <SettingListCommon navigation={navigation} listInfo={item} index = {index} key={ item+index } ></SettingListCommon>
              )
            })} 
          </View>
          


        </View>
      </SafeAreaView>
    )
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    flexDirection: 'column',
    // margin: 20,
    backgroundColor: 'white'
  },
  title: {
    fontSize: 22,
    fontWeight: 'bold',
    marginTop: 0,
    marginBottom: 20,
  },
})


export default SettingListPage